<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>
			商品添加
		</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="format-detection" content="telephone=no">
		<link rel="stylesheet" href="./css/x-admin.css" media="all">
		<link rel="stylesheet" href="css/jquery.mobile.min.css" />
		<link href="css/xtiper.css" type="text/css" rel="stylesheet" />
		<script src="js/xtiper.min.js" type="text/javascript"></script>
	</head>

	<body onload="searchstate()">
		<div onclick="turn()">
			<img src="images/返回.png" style="width: 30;" height="30">
			</div>
		<div class="x-body">
				<div class="layui-form-item">
					<label class="layui-form-label">
                        <span class="x-red">*</span>商品图片
                    </label>
					<div class="layui-input-inline">
						<form enctype="multipart/form-data" id="uploadForm">
						<input type="file" id="file" style="width: 190px;height: 40px;" onchange="preImg(this.id,'imgPre');">
						</form>
						<img id="imgPre" src="" width="100px" height="100px" style="display: block;" />
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">
                        <span class="x-red">*</span>商品名称
                    </label>
					<div class="layui-input-inline">
						<input type="text" id="goodsname" class="layui-input">
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">
                        <span class="x-red">*</span>商品类型
                    </label>
					<div>
						<select name="type" id="searchs" style="width: 190px;border: solid 1px #E6E6E6;height: 40px;">
						</select>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">
                        <span class="x-red">*</span>单位
                    </label>
					<div>
						<select name="type" id="units" style="width: 190px;border: solid 1px #E6E6E6;height: 40px;">
						</select>
					</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">
                        <span class="x-red">*</span>单价
                    </label>
					<div class="layui-input-inline">
						<input type="text" id="price" class="layui-input">
					</div>
				</div>

				<div class="layui-form-item">
					<label class="layui-form-label">
                        <span class="x-red">*</span>商品介绍
                    </label>
					<div class="layui-input-inline">
						<input type="text" id="goodsintroduce" class="layui-input">
					</div>
				</div>
				<div class="layui-form-item" >
					<label class="layui-form-label">
                    </label>
                    <div onclick="save()">
					<button class="layui-btn"> 保存 </button>
                    </div>
				</div>
		</div>
		<script src="./lib/layui/layui.js" charset="utf-8">
		</script>
		<script src="./js/x-layui.js" charset="utf-8">
		</script>
		<script src="js/jquery.min.js"></script>
		<script type="text/javascript">
			function searchstate() {
				$("#searchs").empty();
				var settings = {
					"url": "http://127.0.0.1:8080/type/findall",
					"method": "GET",
					"timeout": 0,
					"headers": {
						"Content-Type": "application/json"
					},
				};
				$.ajax(settings).done(function(response) {
					for(var i = 0; i < response.length; i++) {
						$("#searchs").append("<option value='" + response[i].typeName + "'>" + response[i].typeName + "</option>");
					}
				});

				var settings = {
					"url": "http://localhost:8080/unit/findall",
					"method": "POST",
					"timeout": 0,
					"headers": {
						"Content-Type": "application/json"
					},
				};
				$.ajax(settings).done(function(response) {
					for(var i = 0; i < response.length; i++) {
						$("#units").append("<option value='" + response[i].unitName + "'>" + response[i].unitName + "</option>");
					}
				});
			}
		</script>
		<!--
        	作者：1005914681@qq.com
        	时间：2020-02-06
        	描述：预览图片
        -->
		<script type="text/javascript">
			function getFileUrl(sourceId) {
				var url;
				if(navigator.userAgent.indexOf("MSIE") >= 1) { // IE 
					url = document.getElementById(sourceId).value;
				} else if(navigator.userAgent.indexOf("Firefox") > 0) { // Firefox 
					url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
				} else if(navigator.userAgent.indexOf("Chrome") > 0) { // Chrome 
					url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
				}
				return url;
			}

			function preImg(sourceId, targetId) {
				var url = getFileUrl(sourceId);
				var imgPre = document.getElementById(targetId);
				imgPre.src = url;
			}
		</script>
		<!--
			var str = "/" + file.replace(/\\/g, "\/"); //反斜杠转化为斜杠
		-->
		<script type="text/javascript">
			function save() {
				if($("#file").val() == "") {
					xtip.msg('文件未上传！');
				} else if($("#goodsname") == "") {
					xtip.msg('商品名为空！');
				} else if($("#price").val() == "") {
					xtip.msg('价格未填！');
				} else if($("#goodsintroduce") == "") {
					xtip.msg('商品介绍为空！');
				} else {
					var url = "http://localhost:8080/species/findspeciesname?speciesName=" + $("#goodsname").val();
					var settings = {
						"url": url,
						"method": "POST",
						"timeout": 0,
						"headers": {
							"Content-Type": "application/json"
						},
					};
					$.ajax(settings).done(function(response) {
						if(response == 0) {
							saveInfor();
						} else {
							reuser(response);
						}
					});
				}
			}
		</script>
		<script type="text/javascript">
			function reuser(speciesId){
				xtip.confirm('查询到相同名称的历史商品，可能是同一商品，是否重新启用？', function() {
						var url = 'http://127.0.0.1:8080/species/updateState?speciesId=' + speciesId;
						var settings = {
							"url": url,
							"method": "GET",
							"timeout": 0,
							"headers": {
								"Content-Type": "application/json"
							},
						};
						$.ajax(settings).done(function(response) {
							xtip.msg('重新启用成功');
							setTimeout(function (){location.href='./species-list.html'},1000);
						});
					});
			}
		</script>
<script type="text/javascript">
	function saveInfor() {
		var form = new FormData(document.getElementById("uploadForm"));
		form.append("multipartFile",  $('#file')[0].files[0]);
		var str='http://localhost:8080/species/insert?speciesName='+$("#goodsname").val()+'&speciesPrice='+$("#price").val()+'&speciesIntroduce='+$("#goodsintroduce").val()+'&typeName='+$("#searchs").val()+'&unitName='+$("#units").val();
       $.ajax({
			url: str,
			data: form,
			type: 'POST',
			dataType: 'JSON',
			cache: false,
			processData: false,
			contentType: false,
			success: function(data) {
					xtip.msg('添加成功！');
					setTimeout(function (){location.href="./species-list.html";},1000);
            },
			error: function() {
				xtip.msg('添加失败！');
			}
        })

    }
</script>
<script>
	function turn(){
		location.href="./species-list.html";
	}
</script>
</body>
</html>